<template>
    <div class="container">
      <Breadcrumb :items="['数据分析',  '全市问题数据统计']" />
      <a-card class="general-card" style="padding-top:5px">
        <a-row>
        <a-col :flex="1">
          <a-form :model="formModel" label-align="right">
            <a-row :gutter="16">
              <a-space wrap :size="5">

                <a-form-item field="quarter" label-col-flex="120px"
                  label="清单查摆问题表现">
                  <a-select v-model="formModel.prominentProblem.value" :style="{ width: '180px' }" allow-clear
                    placeholder="全部"
                    allow-search
                    :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option :value="item.label" v-for="item in questionList1">{{item.label}}</a-option>
                  </a-select>
                </a-form-item>

                <a-form-item field="quarter" label-col-flex="100px"
                  label="突出问题类型">
                  <a-select v-model="formModel.problemType.value" :style="{ width: '180px' }" allow-clear
                    placeholder="全部"
                    allow-search
                    :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option :value="item.label" v-for="item in questionList2">{{item.label}}</a-option>
                  </a-select>
                </a-form-item>

                <a-form-item field="department" label-col-flex="80px"
                  label="责任单位">
                  <a-input
                    v-model="formModel.department.value"
                    placeholder="请选择责任单位"
                    style="width: 130px;"
                  />
                </a-form-item>

                <a-form-item field="quarter" label-col-flex="80px"
                  label="时间范围">
                  <a-range-picker
                    v-model="formModel.dateRange.value"
                    mode="date"
                    style="width: 240px;"
                  />
                </a-form-item>  


                <a-form-item label-col-flex="0px" label="">
                  <a-space direction="horizontal" :size="12">
                    <a-button @click="fetchData">
                      <template #icon>
                        <icon-refresh />
                      </template>
                      查询
                    </a-button>

                    <a-switch>
                      <template #checked>
                        展开
                      </template>
                      <template #unchecked>
                        折叠
                      </template>
                    </a-switch>
                  </a-space>
                </a-form-item>
              </a-space>
            </a-row>
          </a-form>
        </a-col>
      </a-row>
        <a-table :data="renderData" :columns="columns" :pagination="false" :bordered="{cell:true}" :scrollbar="true"
          :scroll="{ x: '100%', y: '100%' }">
        </a-table> 
      </a-card>
    </div>
  </template>
  
  <script lang="ts" setup>
  import { computed, ref, reactive, watch, nextTick } from 'vue';
  import { useRouter } from 'vue-router';
  import { Modal, Message } from '@arco-design/web-vue';
  import { postRequest, uploadFileRequest } from '@/api/common';
  import { baseURL } from '@/api/base';
  import { formatSortByArea } from '@/utils/sortUtil.js';

  const downAll = ()=>{
   
  }


const questionList1:any[] = [
  {
    label: "“民生小案”破案",value: "101",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "1" }]
  },
  {
    label: "命案防范",value: "102",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "2" }]
  },
  {
    label: "矛盾纠纷实质性化解",value: "103",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "3" }]
  },
  {
    label: "执行难破解难",value: "104",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "4" }]
  },
  {
    label: "后进村整顿",value: "105",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "5" }]
  },
  {
    label: "行政村布局调整“后半篇”文章",value: "106",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "6" }]
  },
  {
    label: "12345投诉办理不及时",value: "107",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "7" }]
  },
  {
    label: "不担当不作为集中整治处理中其它突出问题",value: "108",
    children: [{ label: "不担当不作为、推诿扯皮问题",value: "8" }]
  },
  {
    label: "政绩观偏差、搞“面子工程”问题",value: "109",
    children: [{ label: "政绩观偏差、搞“面子工程”问题",value: "9" }]
  },
  {
    label: "执行政策“一刀切”、层层加码问题",value: "110",
    children: [{ label: "执行政策“一刀切”、层层加码问题",value: "10" }]
  },
  {
    label: "文风会风不实、搞文山会海问题",value: "111",
    children: [{ label: "文风会风不实、搞文山会海问题",value: "11" }]
  },
  {
    label: "整治形式主义为基层减负存在差距问题",value: "112",
    children: [{ label: "整治形式主义为基层减负存在差距问题",value: "12" }]
  },
  {
    label: "未成年人保护和预防犯罪",value: "113",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "13" }]
  },
  {
    label: "道路交通安全综合治理",value: "114",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "14" }]
  },
  {
    label: "精神障碍患者服务管理",value: "115",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "15" }]
  },
  {
    label: "电信网络诈骗打击",value: "116",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "16" }]
  },
  {
    label: "禁毒工作",value: "117",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "17" }]
  },
  {
    label: "新就业群体“急难愁盼”",value: "118",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "18" }]
  },
  {
    label: "高额彩礼",value: "119",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "19" }]
  },
  {
    label: "外籍新娘管理服务",value: "120",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "20" }]
  },
  {
    label: "失能失智老人日间照护",value: "121",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "21" }]
  },
  {
    label: "留守妇女就业",value: "122",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "22" }]
  },
  {
    label: "留守儿童假期托管",value: "123",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "23" }]
  },
  {
    label: "慢性病老人心电图“一张网”",value: "124",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "24" }]
  },
  {
    label: "中小学生午休“趴睡”变“躺睡”",value: "125",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "25" }]
  },
  {
    label: "市区老年人娱乐场所建设",value: "126",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "26" }]
  },
  {
    label: "“群腐”集中整治处理中其他突出问题",value: "127",
    children: [{ label: "漠视群众、脱离群众、侵害群众利益问题",value: "27" }]
  },
  {
    label: "违规吃喝问题",value: "128",
    children: [{ label: "违规吃喝问题",value: "28" }]
  },
  {
    label: "违规收送礼品礼金问题",value: "129",
    children: [{ label: "违规收送礼品礼金问题",value: "29" }]
  },
  {
    label: "借调研培训等名义公款旅游问题",value: "130",
    children: [{ label: "借调研培训等名义公款旅游问题",value: "30" }]
  },
  {
    label: "违规建设、奢华装修楼堂馆所问题",value: "131",
    children: [{ label: "违规建设、奢华装修楼堂馆所问题",value: "31" }]
  },
  {
    label: "开展照顾性、无实质内容的一般性出国（境）活动问题",value: "132",
    children: [{ label: "开展照顾性、无实质内容的一般性出国（境）活动问题",value: "32" }]
  },
  {
    label: "酒驾醉驾问题",value: "133",
    children: [{ label: "酒驾醉驾问题",value: "33" }]
  },
  {
    label: "违规打牌和赌博问题",value: "134",
    children: [{ label: "违规打牌和赌博问题",value: "34" }]
  },
  {
    label: "化解疑难信访积案",value: "135",
    children: [{ label: "化解疑难信访积案",value: "35" }]
  },
  {
    label: "中小学“校园餐”等领域侵害群众利益问题",value: "136",
    children: [{ label: "中小学“校园餐”等领域侵害群众利益问题",value: "36" }]
  },
  {
    label: "公共交通服务质量不优的问题",value: "137",
    children: [{ label: "公共交通服务质量不优的问题",value: "37" }]
  },
  {
    label: "物业服务履约不到位、侵害业主公共收益问题",value: "138",
    children: [{ label: "物业服务履约不到位、侵害业主公共收益问题",value: "38" }]
  },
  {
    label: "大气污染治理问题",value: "139",
    children: [{ label: "大气污染治理问题",value: "39" }]
  }
];

const questionList2:any[] = [
  {
    label: "不担当不作为、推诿扯皮问题"
  },
  {
    label: "政绩观偏差、搞“面子工程”问题"
  },
  {
    label: "执行政策“一刀切”、层层加码问题"
  },
  {
    label: "文风会风不实、搞文山会海问题"
  },
  {
    label: "整治形式主义为基层减负存在差距问题"
  },
  {
    label: "漠视群众、脱离群众、侵害群众利益问题"
  },
  {
    label: "违规吃喝问题"
  },
  {
    label: "违规收送礼品礼金问题"
  },
  {
    label: "借调研培训等名义公款旅游问题"
  },
  {
    label: "违规建设、奢华装修楼堂馆所问题"
  },
  {
    label: "开展照顾性、无实质内容的一般性出国（境）活动问题"
  },
  {
    label: "酒驾醉驾问题"
  },
  {
    label: "违规打牌和赌博问题"
  },
  {
    label: "化解疑难信访积案"
  },
  {
    label: "中小学“校园餐”等领域侵害群众利益问题"
  },
  {
    label: "公共交通服务质量不优的问题"
  },
  {
    label: "物业服务履约不到位、侵害业主公共收益问题"
  },
  {
    label: "大气污染治理问题"
  }
];


  const router = useRouter();
  const formModel = {
    department: ref(""),
    prominentProblem: ref(""),
    dateRange: ref<any[]>([]),
    problemType: ref(""),
    circularIssuesNo: ref(""),
  };
  const renderData = ref<any[]>([]);
  const columns:any = reactive([
    {
      title: '自查自纠发现问题总数',
      dataIndex:'problemsFoundCount',
      align: 'center',
      width: 120,
    },
    {
      title: '整治处理中问题总数',
      dataIndex:'inProgressCount',
      align: 'center',
      width: 120,
    },
    {
      title: '已整治销号总数',
      dataIndex:'closedCount',
      align: 'center',
      width: 120,
    },
    {
      title: '查处违纪违法案件数',
      dataIndex:'disciplinaryCases',
      align: 'center',
      width: 120,
    },
    {
      title: '组织处理人数',
      dataIndex:'punishedPersons',
      align: 'center',
      width: 120,
    },
    {
      title: '纪律处分人数',
      dataIndex:'disciplinaryPunishedPersons',
      align: 'center',
      width: 120,
    },
    {
      title: '发出执纪执法建议（文书）数',
      dataIndex:'recommendationLetters',
      align: 'center',
      width: 150,
    },
    {
      title: '通报涉及问题数',
      dataIndex:'circularIssues',
      align: 'center',
      width: 120,
    },
    {
      title: '建立制度数',
      dataIndex:'establishedSystems',
      align: 'center',
      width: 120,
    }
  ]);
  
  
  // 修改fetchData函数，直接使用静态数据
  const fetchData = async() => {
    let sumData = reactive({
      totalQuestionCount: 0,
      problemsFoundCount: 0,
      closedCount: 0 as any,
      inProgressCount: 0,
      disciplinaryCases: 0,
      punishedPersons: 0,
      disciplinaryPunishedPersons:0,
      circularIssues: 0 as any,
      recommendationLetters: 0,
      establishedSystems:0
    });
    let res = await postRequest("dsms/jyData/queryData", {
      pageNum: 1,
      prominentProblem:formModel.prominentProblem.value,
      problemType:formModel.problemType.value,
      department:formModel.department.value,
      dateRange:formModel.dateRange.value,
      pageSize: 9999
    });
    // 计算合计行数据
    res.list.forEach((item: any) => {
      sumData.problemsFoundCount = sumData.problemsFoundCount + item.problemsFoundCount;;
      sumData.closedCount = sumData.closedCount + item.closedCount;
      sumData.inProgressCount = sumData.inProgressCount + item.inProgressCount;
      sumData.disciplinaryCases = sumData.disciplinaryCases + item.disciplinaryCases;
      sumData.punishedPersons = sumData.punishedPersons + item.punishedPersons;
      sumData.disciplinaryPunishedPersons = sumData.disciplinaryPunishedPersons + item.disciplinaryPunishedPersons;
      sumData.recommendationLetters = sumData.recommendationLetters + item.recommendationLetters;
      sumData.circularIssues = sumData.circularIssues + item.circularIssues;
      sumData.establishedSystems = sumData.establishedSystems + item.establishedSystems;
    });
    renderData.value = [sumData];

  };
  
  fetchData();
  </script>
  
  <script lang="ts">
  export default {
    name: 'comprehensive',
  };
  </script>
  
  <style scoped lang="less">
  .container {
    padding: 0 20px 20px 20px;
  }
  ::v-deep(.arco-input-wrapper .arco-input[disabled]){
    color: black;
    -webkit-text-fill-color: black;
  }
  </style>